<form name="form" ng-init="vm.init();refresh();" ng-submit="vm.format(form.$valid)" novalidate>
  <div class="row x-page-header">
    <div class="col-md-12">
      <div class="x-page-title">JSON格式化</div>
      <div class="pull-right">
        <button class="btn btn-primary" type="submit">格式化</button>
        <button id="copy" class="btn btn-success" type="button" data-clipboard-action="copy"
            ng-disabled="vm.json == null">复制</button>
        <button class="btn btn-danger" type="reset" ng-click="vm.reset()">重置</button>
      </div>
    </div>
  </div>
  <div class="row x-page-body">
    <div class="col-md-6">
      <fieldset>
        <legend>源数据</legend>
        <div class="form-group">
          <textarea class="form-control x-page-scope" name="data" ng-model="vm.data" required autofocus
              ng-class="{'x-invalid': form.$submitted && form.data.$invalid}"></textarea>
        </div>
      </fieldset>
    </div>
    <div class="col-md-6">
      <fieldset>
        <legend>目标数据<font color="red">（行号栏会显示校验信息）</font></legend>
        <div class="x-page-scope" ng-show="vm.json != ''">
          <div class="x-editor">
            <pre class="pretty-json" id="json-viewer"></pre>
          </div>
        </div>
        <div class="alert alert-danger" ng-if="vm.error">{{vm.error}}</div>
      </fieldset>
    </div>
  </div>
</form>
